<template>

    <div>
        4857232394023
    </div>

</template>

<script>
import { adList, adSave, adDelete } from "../../api/ad/ad";
import Upload from "../../components/File/Upload.vue";
const formJson = {
    ad_id: "",
    title: "",
    describe: "",
    pic: "",
    pic_url: "",
    jump_type: "",
    jump_url: "",
    ios_url: "",
    android_url: "",
    wxa_appid: "",
    channel_type: 0,
    channel_list: [],
    android_version_type: 0,
    android_version_list: [],
    ios_version_type: 0,
    ios_version_list: [],
    new_show_start_num: 0,
    new_show_max_num: 0,
    old_show_start_num: 0,
    old_show_max_num: 0,
    end_time: "",
    event_name: "",
    status: 1
};
export default {
    data() {
        return {
            query: {
                title: "",
                page: 1,
                limit: 20
            },
            channelListInput: "",
            androidVersionListInput: "",
            iosVersionListInput: "",
            list: [],
            total: 0,
            loading: true,
            index: null,
            formName: null,
            formMap: {
                add: "新增",
                edit: "编辑"
            },
            formLoading: false,
            formVisible: false,
            formData: formJson,
            formRules: {
                title: [
                    {
                        required: true,
                        message: "请输入广告标题",
                        trigger: "blur"
                    }
                ],
                pic: [
                    {
                        required: true,
                        message: "请选择封面图片",
                        trigger: "change"
                    }
                ],
                jump_type: [
                    {
                        required: true,
                        message: "请选择跳转方式",
                        trigger: "change"
                    }
                ],
                jump_url: [
                    {
                        required: true,
                        message: "请输入跳转链接",
                        trigger: "blur"
                    }
                ],
                android_url: [
                    {
                        required: true,
                        message: "请输入Android类名",
                        trigger: "blur"
                    }
                ],
                ios_url: [
                    {
                        required: true,
                        message: "请输入IOS类名",
                        trigger: "blur"
                    }
                ],
                wxa_appid: [
                    {
                        required: true,
                        message: "请输入小程序Appid",
                        trigger: "blur"
                    }
                ],
                channel_list: [
                    {
                        required: true,
                        message: "请输入至少一个渠道名单",
                        trigger: "change"
                    }
                ],
                android_version_list: [
                    {
                        required: true,
                        message: "请输入至少一个Android版本名单",
                        trigger: "change"
                    }
                ],
                ios_version_list: [
                    {
                        required: true,
                        message: "请输入至少一个iOS版本名单",
                        trigger: "change"
                    }
                ],
                status: [
                    { required: true, message: "请选择状态", trigger: "change" }
                ]
            },
            deleteLoading: false
        };
    },
    components: {
        Upload
    },
    methods: {
        onReset() {
            this.$router.push({
                path: ""
            });
            this.query = {
                title: "",
                page: 1,
                limit: 20
            };
            this.getList();
        },
        onSubmit() {
            this.$router.push({
                path: "",
                query: this.query
            });
            this.getList();
        },
        handleSizeChange(val) {
            this.query.limit = val;
            this.getList();
        },
        handleCurrentChange(val) {
            this.query.page = val;
            this.getList();
        },
        getList() {
            this.loading = true;
            adList(this.query)
                .then(response => {
                    this.loading = false;
                    this.list = response.data.list || [];
                    this.total = response.data.total || 0;
                })
                .catch(() => {
                    this.loading = false;
                    this.list = [];
                    this.total = 0;
                });
        },
        // 删除渠道
        handleChannelListClose(index) {
            console.log(index);
            // 更改值
            this.formData.channel_list.splice(index, 1);
        },
        // 添加渠道白名单
        handleChannelListSubmit() {
            // 更改值
            if (
                this.channelListInput &&
                this.formData.channel_list.length < 15
            ) {
                let arr = this.channelListInput.split(",");
                for (let i in arr) {
                    if (
                        arr[i] !== "" &&
                        (this.formData.channel_list.length === 0 ||
                            this.formData.channel_list.indexOf(arr[i]) < 0)
                    ) {
                        this.formData.channel_list.push(arr[i]);
                    }
                }
                this.channelListInput = "";
                this.$refs.channelListRef.focus();
            }
        },
        // 删除Android版本
        handleAndroidVersionListClose(index) {
            // 更改值
            this.formData.android_version_list.splice(index, 1);
        },
        // 添加Android版本
        handleAndroidVersionListSubmit() {
            // 更改值
            if (
                this.androidVersionListInput &&
                this.formData.android_version_list.length < 15
            ) {
                let arr = this.androidVersionListInput.split(",");
                for (let i in arr) {
                    let avList = this.formData.android_version_list;
                    if (
                        arr[i] !== "" &&
                        (avList.length === 0 || avList.indexOf(arr[i]) < 0)
                    ) {
                        this.formData.android_version_list.push(arr[i]);
                    }
                }
                this.androidVersionListInput = "";
                this.$refs.androidVersionListRef.focus();
            }
        },
        // 删除Ios版本
        handleIosVersionListClose(index) {
            // 更改值
            this.formData.ios_version_list.splice(index, 1);
        },
        // 添加Ios版本
        handleIosVersionListSubmit() {
            // 更改值
            if (
                this.iosVersionListInput &&
                this.formData.ios_version_list.length < 15
            ) {
                let arr = this.iosVersionListInput.split(",");
                for (let i in arr) {
                    if (
                        arr[i] !== "" &&
                        (this.formData.ios_version_list.length === 0 ||
                            this.formData.ios_version_list.indexOf(arr[i]) < 0)
                    ) {
                        this.formData.ios_version_list.push(arr[i]);
                    }
                }
                this.iosVersionListInput = "";
                this.$refs.iosVersionListRef.focus();
            }
        },
        // 刷新表单
        resetForm() {
            if (this.$refs["dataForm"]) {
                // 清空字段
                this.$refs["dataForm"].resetFields();
                // 清空验证信息表单
                this.$refs["dataForm"].clearValidate();
            }
        },
        // 隐藏表单
        hideForm() {
            // 更改值
            this.formVisible = !this.formVisible;
            return true;
        },
        // 显示表单
        handleForm(index, row) {
            this.formVisible = true;
            // 刷新表单
            this.resetForm();
            this.formData = JSON.parse(JSON.stringify(formJson));
            if (row !== null) {
                this.formData = Object.assign({}, row);
            }
            this.formName = "add";
            if (index !== null) {
                this.index = index;
                this.formName = "edit";
            }
        },
        formSubmit() {
            this.$refs["dataForm"].validate(valid => {
                if (valid) {
                    this.formLoading = true;
                    let data = Object.assign({}, this.formData);
                    adSave(data, this.formName)
                        .then(response => {
                            this.formLoading = false;
                            if (response.code) {
                                this.$message.error(response.message);
                                return false;
                            }
                            this.$message.success("操作成功");
                            this.formVisible = false;
                            if (this.formName === "add") {
                                // 向头部添加数据
                                data.ad_id = response.data.ad_id;
                                this.list.unshift(data);
                            } else {
                                this.list.splice(this.index, 1, data);
                            }
                        })
                        .catch(() => {
                            this.formLoading = false;
                        });
                }
            });
        },
        // 删除
        handleDel(index, row) {
            if (row.ad_id) {
                this.$confirm("确认删除该记录吗?", "提示", {
                    type: "warning"
                })
                    .then(() => {
                        let para = { ad_id: row.ad_id };
                        this.deleteLoading = true;
                        adDelete(para)
                            .then(response => {
                                this.deleteLoading = false;
                                if (response.code) {
                                    this.$message.error(response.message);
                                    return false;
                                }
                                this.$message("删除成功");
                                // 刷新数据
                                this.list.splice(index, 1);
                            })
                            .catch(() => {
                                this.deleteLoading = false;
                            });
                    })
                    .catch(() => {
                        this.$message.info("取消删除");
                    });
            }
        },
        onSelectPic(filePath, filePathUrl) {
            this.formData.pic = filePath;
            this.formData.pic_url = filePathUrl;
        }
    },
    filters: {
        statusFilterType(status) {
            const statusMap = {
                0: "gray",
                1: "success"
            };
            return statusMap[status];
        },
        statusFilterName(status) {
            const statusMap = {
                0: "禁用",
                1: "正常"
            };
            return statusMap[status];
        }
    },
    mounted() {},
    created() {
        // 将参数拷贝进查询对象
        let query = this.$route.query;
        this.query = Object.assign(this.query, query);
        this.query.limit = parseInt(this.query.limit);
        // 加载表格数据
        this.getList();
    }
};
</script>

<style type="text/scss" lang="scss">
</style>
